package com.hippo.core.ui.components

import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.HorizontalDivider
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.OutlinedTextField
import androidx.compose.material3.OutlinedTextFieldDefaults
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.hippo.core.ui.theme.ColorHint
import com.hippo.core.ui.theme.ColorTextBlack
import com.hippo.core.ui.theme.HippoTheme

@Composable
fun EditLayout(
    modifier: Modifier = Modifier,
    title: String,
    hint: String? = null,
    rightAlign: Boolean = true,
    onValueChange: (String) -> Unit,
) {


    Column {

        Row(
            modifier = modifier
        ) {

            HorizontalSpacer(8.dp)

            Text(
                text = title,
                modifier = Modifier.align(Alignment.CenterVertically),
                style = MaterialTheme.typography.labelMedium.copy(
                    color = ColorTextBlack
                )
            )

            OutlinedTextField(
                modifier = Modifier.weight(1f),
                value = "",
                onValueChange = onValueChange,
                placeholder = {
                    Text(
                        modifier = Modifier.fillMaxWidth(),
                        text = hint?:title,
                        style = MaterialTheme.typography.bodyMedium,
                        color = ColorHint,
                        textAlign = if (rightAlign) TextAlign.End else TextAlign.Start,
                        fontSize = 12.sp,
                        overflow = TextOverflow.Ellipsis,
                    )
                },
                colors = OutlinedTextFieldDefaults.colors(
                    focusedBorderColor = Color.Transparent,
                    unfocusedBorderColor = Color.Transparent,
                ),
                singleLine = true,
                textStyle = TextStyle(textAlign = TextAlign.End, fontSize = 12.sp)
            )
        }

       HorizontalDivider(thickness = 0.5.dp)
    }


}


@Preview(showBackground = true)
@Composable
private fun ItemLayoutPreview() {
    HippoTheme {
        EditLayout(
            title = "Item Layout",
            hint = "请输入内容",
            onValueChange = {}
        )
    }
}

